<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>框架页面</title>
  <link rel="preload" href="https://at.alicdn.com/t/font_2247954_h5q3kys1afm.woff2" as="font" type="font/woff2" crossorigin="anonymous">
  <link rel="stylesheet" href="https://at.alicdn.com/t/font_2247954_h5q3kys1afm.css">
  <link rel="stylesheet" href="../style/index.css" />
</head>
<body>
  <div class="layout-container theme-dark">
    <!-- 侧栏 -->
    <aside class="layout-aside">
      <div class="aside-header">
        <div class="logo">
          <img src="imgs/logo.png" />
        </div>
        <div class="cur-selected-box">
          <div class="cur-selected-inner">
            <!-- 左侧头像 -->
            <div class="avatar">

            </div>
            <div class="cur-selected-info">
              <div class="info-top">思源物业办公室</div>
              <div class="info-bottom">已选择所有楼宇</div>
            </div>
            <!-- 右侧小箭头 -->
            <div class="right-arrow"></div>
          </div>
        </div>
      </div>      
      <div class="menus-wrapper">
        <div class="menu-level-one opened">
          <div class="menu-icon"><span class="iconfont icon-workbench"></span></div>
          <div class="menu-name">
            <div class="menu-tit">信息概览</div>
          </div>
          <!-- 二级菜单 -->
          <div class="menu-level-two">
            <div class="level-two-item">
              <div class="level-two-tit">应收管理</div>
            </div>
            <div class="level-two-item">
              <div class="level-two-tit">计费标准</div>
            </div>
            <div class="level-two-item">
              <div class="level-two-tit">分摊管理</div>
            </div>
          </div>
          <div class="menu-arrow"><span class="iconfont icon-down"></span></div>
        </div>
        <div class="menu-level-one active">
          <div class="menu-icon"><span class="iconfont icon-data"></span></div>
          <div class="menu-name">
            <div class="menu-tit">收费管理</div>            
          </div>
          <!-- 二级菜单 -->
          <div class="menu-level-two">
            <div class="level-two-item active">
              <div class="level-two-tit">应收管理</div>
              <ul class="menu-level-three">
                <li class="level-three-item">应收生成</li>
                <li class="level-three-item">应收管理</li>
                <li class="level-three-item">减免管理</li>
                <li class="level-three-item">违约金管理</li>
              </ul>
            </div>
            <div class="level-two-item">
              <div class="level-two-tit">计费标准</div>
            </div>
            <div class="level-two-item">
              <div class="level-two-tit">分摊管理</div>
            </div>
          </div>
          <div class="menu-arrow"><span class="iconfont icon-down"></span></div>
        </div>
        <div class="menu-level-one">
          <div class="menu-icon"><span class="iconfont icon-service"></span></div>
          <div class="menu-name">客户服务</div>
          <div class="menu-arrow"><span class="iconfont icon-down"></span></div>
        </div>
        <div class="menu-level-one">
          <div class="menu-icon"><span class="iconfont icon-integral"></span></div>
          <div class="menu-name">信息概览</div>
          <div class="menu-arrow"><span class="iconfont icon-down"></span></div>
        </div>
        <div class="menu-level-one">
          <div class="menu-icon"><span class="iconfont icon-caidan"></span></div>
          <div class="menu-name">信息概览</div>
          <div class="menu-arrow"><span class="iconfont icon-down"></span></div>
        </div>
        <div class="menu-level-one">
          <div class="menu-icon"><span class="iconfont icon-set"></span></div>
          <div class="menu-name">系统设置</div>
          <div class="menu-arrow"><span class="iconfont icon-down"></span></div>
        </div>
      </div>
    </aside>
    <!-- 主体区域 -->
    <main class="layout-main">
      <!-- 头部区域start -->
      <header class="layout-header">
        <div class="layout-header-left">
          <span class="iconfont icon-menu-fold"></span>
        </div>
        <div class="flex-space"></div>
        <div class="layout-header-right">
          <div class="layout-header-icons">
            <span class="iconfont icon-favorites"></span>
            <span class="iconfont icon-messagecenter-fill"></span>
            <span class="iconfont icon-set"></span>
          </div>
          <div class="login-user-wrap"><!-- 登录用户 -->
            <div class="login-user">江</div>
          </div>
        </div>
      </header><!-- 头部区域end -->
      <!-- 页签start -->
      <nav class="nav-box">
        <div class="nav-inner">

        </div>
      </nav><!-- 页签end -->
      <div class="layout-main-content">
        <div class="main-content-inner">

        </div>
      </div>
    </main>
  </div>
</body>
</html>